<template>
	<view class="message-content" @click="toChat(item)">
		<view class="flex-row">
			<uni-badge :text="item.notReadNumber" absolute="rightTop" size="small">
				<Avatar class="avatar" :user="item.profileVo" size="106rpx" />
			</uni-badge>
			<view class="message-info">
				<view class="user-name">{{item.profileVo.nickName}}</view>
				<view class="message-text line-clamp1">{{item.lastMessage}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	import Avatar from '@/components/Avatar/Avatar.vue';
	export default {
		components: {
			Avatar
		},
		props: {
			item: {
				type: Object,
				default: () => {}
			}
		},
		methods: {
			toChat(item) {
				uni.navigateTo({
					url: `/pages/chat/index/index?data=${JSON.stringify(item)}`
				})
			}
		}
	}
</script>


<style scoped lang="scss">
	.message-content {
		margin-bottom: 30rpx;

		&:last-child {
			margin-bottom: 0;
		}

		.avatar {
			margin-right: 18rpx;
			flex-shrink: 0;
		}

		.message-info {
			.user-name {
				width: calc(100vw - 270rpx);
				font-size: 32rpx;
				color: #333;
			}

			.message-text {
				width: calc(100vw - 270rpx);
				font-size: 28rpx;
				color: #666;
			}
		}
	}
</style>